@import "./normalize.scss";
@import "./sassConfig.scss";
@import "./ui.scss";

@font-face {
  font-family: "bahnschrift";
  src: url("~@/assets/bahnschrift.ttf");
}

i[class^=icon] {
  display: inline-block;
  width: 44px;
  height: 44px;
  border-radius: 100px;
  background: $color-main;
}
.icon-success { background-image: url(~@/assets/images/success.png); }
.icon-fail { background-image: url(~@/assets/images/fail.png); }

// color
.color-main {color: $color-main;}
.color-white{color:white;}
.color-success { color: #09bd00; }
.color-fail { color: #bd1b00; }

// text-align
.text-center {text-align: center;}
.text-left {text-align: left;}
.text-right {text-align: right;}

// position
.p-r {position: relative;}
.p-a {position: absolute;}

// float
.pull-right { float: right; }
.pull-left { float: left; }

/* clearfix */
.clearfix { @extend %clearfix; }
.mr-15 { margin-right: 15px; }

// font-size
.fs-24 {font-size: 24px;}
.fs-12 { font-size: 12px; }
.fs-18 { font-size: 18px; }
.fa-b { font-family: "bahnschrift"; }

// common ui
.select-car-btn {
  width: 240px;
  height: 84px;
  line-height: 84px;
  text-align: center;
  border-radius: 100px;
  background-color: $color-main;
  color: #fff;
  font-size: 26px;
}

// opacity
.opacity-40{opacity: 0.4;}

// flex
.flex-1 { flex: 1; }

.user-container { padding: 0 30px; overflow-y: auto; height: 100%; }

.blank-40 { height: 40px; }
.blank-20 { height: 20px; }
.blank-100 { height: 100px; }

.button-block {
  width: 100%;
  display: block;
  text-align: center;
}
